<template>
	<view class="cardbody">
		<u-navbar back-text="全部图片" :border-bottom="false" :back-text-style="textStyle" back-icon-color="#000000" style="font-weight: bold;font-family: PingFang SC;"></u-navbar>
		<mescroll-body top="0" :down="downOption" :up="upOption" :height="comHeight" ref="mescrollRef" @init="mescrollInit" @down="downCallback">
			<view style="width: 100%;margin: auto;">
			
				<view style=" width:100% ;margin: auto;padding-top: 20rpx;">
					<view style="width: 92%;margin: auto;display: flex;flex-wrap: wrap; justify-content: space-between;align-items: center;">
						<view style="height: 248rpx;width: 48%;background-color: #F0F0F0;margin-bottom: 25rpx;" v-for="(item, index) in shangjia_list" :key="index">
							<image :src="item.url" style="width: 100%;height: 100%;" mode="aspectFill"></image>
						
						</view>
					</view>
				</view>
				
				<view style="margin: 40rpx 0;">
					<u-divider color="#DEDEDE" half-width="120" border-color="#DEDEDE">{{prompt}}</u-divider>
				</view>
			</view>
		</mescroll-body>
		<u-toast ref="uToast" />
		
	</view>
</template>

<script>
	var that;
	export default {
		data() {
			return {
				textStyle: {
					color: '#272755'
				},
				downOption: {
					use: true,
					auto: false,
					offset: 40
				},
				upOption: {
					use: false
				},
				mescroll: null,
				imgs:[],
				prompt: '',
				page: 1,
				totalPage:1,
				pageSize:20,
				shangjia_list:[],
				cards: [
					{},
					{},
					{}
				],
				comHeight:0,
				type:'',
				enterpriseId:'',
			};
		},
		onLoad(option) {
			that = this;
			this.page=1
			this.type=option.num
			this.enterpriseId=option.enterpriseId
			if(option.num==0){
				this.image_album(option.enterpriseId)
			}else{
				this.image_appraise(option.enterpriseId)
			}
			
			var menuButtonInfo = uni.getMenuButtonBoundingClientRect();
			const {
				top,
				width,
				height,
				right
			} = menuButtonInfo;
			uni.getSystemInfo({
				success: res => {
					const {
						statusBarHeight
					} = res;
					const margin = top - statusBarHeight;
					var navHeight = height + statusBarHeight + margin * 4;
					that.comHeight = (res.windowHeight  - navHeight) + 'px';
					console.log(that.comHeight);
				}
			});
			
		},
		onShow() {},

		onReachBottom() {
			if(this.type==0){
				if (this.totalPage == this.page) {
					return false;
				} else {
					this.page += 1;
					this.appletOrderPage(this.enterpriseId);
				}
			}else{
				if (this.totalPage == this.page) {
					return false;
				} else {
					this.page += 1;
					this.image_appraise(this.enterpriseId);
				}
			}
			
		},
		methods: {
			jump(){
				uni.navigateTo({
					url:'shoop_all'
				})
			},
			//商家相册图片
			image_album(enterpriseId) {
				let opts = {
					way: true, //true JSON请求；false 表单请求
					method: 'post',
					url: 'image/album/page',
				};
				let data = {
					id: enterpriseId,
					page:this.page,
					pageSize:this.pageSize
				};
				this.http.httpTokenRequest(opts, data).then(res => {
					if (res.code = 200) {
						if (res.data.records.length > 0) {
							this.totalPage = res.data.pages;
							if (res.data.records.length > 0 || _this.page != 1) {
								this.showList = false;
								if (res.data.current * res.data.size < res.data.total) {
									for (const key in res.data.records) {
										this.shangjia_list.push(res.data.records[key]);
									}
									this.prompt = '加载中....';
								} else {
									for (const key in res.data.records) {
										this.shangjia_list.push(res.data.records[key]);
									}
									this.prompt = '没有更多了';
								}
							} else {
								this.showList = true;
								this.shangjia_list = [];
								this.prompt = '没有更多了';
							}
						} else {
							this.prompt = '没有更多了';
						}
					} else {
						this.$refs.uToast.show({
							title: res.message,
							type: 'error'
						})
					}
				})
			},
			
			//用户评价相册图片
			image_appraise(enterpriseId) {
				let opts = {
					way: true, //true JSON请求；false 表单请求
					method: 'post',
					url: 'image/appraise/page',
				};
				let data = {
					id: enterpriseId,
					page:this.page,
					pageSize:this.pageSize
				};
				this.http.httpTokenRequest(opts, data).then(res => {
					if (res.code = 200) {
						if (res.data.records.length > 0) {
							this.totalPage = res.data.pages;
							if (res.data.records.length > 0 || _this.page != 1) {
								this.showList = false;
								if (res.data.current * res.data.size < res.data.total) {
									for (const key in res.data.records) {
										this.shangjia_list.push(res.data.records[key]);
									}
									this.prompt = '加载中....';
								} else {
									for (const key in res.data.records) {
										this.shangjia_list.push(res.data.records[key]);
									}
									this.prompt = '没有更多了';
								}
							} else {
								this.showList = true;
								this.shangjia_list = [];
								this.prompt = '没有更多了';
							}
						} else {
							this.prompt = '没有更多了';
						}
					} else {
						this.$refs.uToast.show({
							title: res.message,
							type: 'error'
						})
					}
				})
			},
			
			
			
			
			mescrollInit(mescroll) {
				this.mescroll = mescroll;
			},
			
			getShopdetails(enterpriseId,num) {
				let opts = {
					way: true, //true JSON请求；false 表单请求
					method: 'post',
					url: 'image/album',
				};
				let data = {
					id: enterpriseId
				};
				this.http.httpTokenRequest(opts, data).then(res => {
					if (res.code = 200) {
						if(num==0){
							this.imgs=res.data.albums
						}else{
							this.imgs=res.data.appraises
						}
						
					} else {
						this.$refs.uToast.show({
							title: res.message,
							type: 'error'
						})
					}
				})
			},
			
		}

	};
</script>

<style>
	.cardbody {
		width: 100%;
		margin: auto;
	}

		
	
	
</style>
